<template>
	<view class="page">
		<view class="uni-header uhead">
			<view class="uni-group" style="padding-right:20rpx">
				<uni-easyinput class="left" prefixIcon="search" v-model="query" placeholder="搜索联系人" @confirm="search"
					@iconClick="search"></uni-easyinput>
			</view>
		</view>
		<view class="uhead">
			<uni-list :border="false">
				<uni-list-item>
					<template slot="header">
						<image class="slot-image" src="/static/txl/ico_company_@3x.png" mode="widthFix"></image>
					</template>
					<view slot="body">
						<text class="uni-list-item__content-title ufont">{{companyName}}</text>
					</view>
				</uni-list-item>
			</uni-list>
		</view>
		<view class="container">
			<uni-list :border="false">
				<uni-list-item v-for="(item, index) in departmentData" :key="index" :leftText="item.percount"
					:ltextclass="0" :rtextclass="0" rightText=""
					showArrow :title="item.name" :ellipsis="0" :clickable="true"
					@click="depClick(item.id,item.name,item.roleType)" />
			</uni-list>
		</view>
		<u-button v-if="roleType == 'SYSTEM_ADMIN'" @click="addContact" class="addbtn">+</u-button>
	</view>
</template>

<script>
	import { listDept } from '@/api/dept.js'
	export default {
		data() {
			return {
				roleType: uni.getStorageSync('roleType'),
				companyName: '海米教育科技',
				loading: '',
				hasMore: '',
				departmentData: [
					{id:0,name:'管理员',roleType:'SYSTEM_ADMIN'},
					{id:1,name:'项目管理',roleType:'PROJECT'},
					{id:2,name:'财务',roleType:'FINANCIAL'},
					{id:3,name:'拍摄',roleType:'GENERAL'},
					{id:4,name:'后期',roleType:'GENERAL'}],
				query: '',
				where: '',
				loadMore: {
					contentdown: '',
					contentrefresh: '',
					contentnomore: ''
				}
			}
		},
		onPullDownRefresh() {

		},
		onReachBottom() {

		},
		onShow() {

		},
		onLoad() {
			this.getDepartment()
		},
		computed: {

		},
		methods: {
			async getDepartment() {
				var res = null;
				try {
					// res = await listDept({
					// 	data: {
					// 		parentId: 0
					// 	}
					// });
					// this.departmentData = res.data
				} catch (err) {

				}
			},
			addContact(){
				if(uni.getStorageSync('roleType') == 'SYSTEM_ADMIN'){
					uni.navigateTo({
						url: '/pages/contact/addStaff'
					})
				}
				
			},
			search() {
				this.$store.state.departmentInfo = {}
				const query = this.query.trim()
				if (!query) {
					query = ''
				}
				uni.navigateTo({
					url: '/pagesContacts/contacts/list2?search=true&query=' + query
				})
			},
			loadData(clear = true) {

			},
			depClick(department_id, name, roleType) {
				uni.navigateTo({
					url: '/pages/contact/contact_sub?id='+department_id+'&name='+name+'&roleType='+roleType
				})
			},
			handleItemClick(id) {
				uni.navigateTo({
					url: '/pagesContacts/contacts/detail?id=' + id
				})
			}
		}
	}
</script>

<style>
	
	.addbtn{
		  position: fixed; /* 使按钮保持固定位置 */
		  bottom: 50px; /* 距离底部20像素 */
		  right: 20px; /* 距离右侧20像素 */
		  background-color: #007bff; /* 背景颜色 */
		  color: white; /* 文本颜色 */
		  border: none; /* 无边框 */
		  border-radius: 50%; /* 圆形按钮 */
		  padding: 15px; /* 填充 */
		  width: 50px;
		  height: 50px;
		  cursor: pointer; /* 鼠标光标变为指针 */
		  z-index: 999; /* 确保按钮在最上层 */
	}


</style>